<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	<style>
		*{
			margin: 0;
			padding: 0;
			list-style: none;
		}
		#box{
			background-color: rgb(58,58,58);
			width: 100%;
			height: 80px;
			text-align: center;
		}
		#head{
			height: 80px;
			display: inline-block;
		}
		.weix{
			height: 80px;
			display: inline-block;
		}
		.weix img{
			width: 120px;
			height: 45px;
			margin-top:15px;
			float: left;
		}
		
		#head .nav{
			float: right;
				padding-top: 21px;
				margin: 0px;
		}
		#head .nav>li{
			
			display: inline-block;
			}
		
		#head .nav>li>a{
			text-decoration: none;
			margin: 0px 2px;
			display: inline-block;
			line-height: 33px;
			height: 33px;
			padding-left: 10px;
			overflow: hidden;
		}
		#head .nav>li>a>span{
			line-height: 33px;
			height: 33px;
			
			padding-right: 15px;
			display: inline-block;
			color: white;
	
		}
		li>a:hover{
			background: url(img/nav.png);
			font-weight: lighter;
		}
		li>a>span:hover{
			background: url(img/nav.png);
			background-position: right;
		}
	</style>
	</head>
	<body>
		<div id="box">
			<div id="head">
				<div class="weix">
					<img src="img/weixin.png" />
				</div>
				<ul class="nav">
					<li><a href=""><span>首页</span></a></li>
					<li><a href=""><span>帮助反馈</span></a></li>
					<li><a href=""><span>微信平台</span></a></li>
					<li><a href=""><span>公众平台</span></a></li>
					<li><a href=""><span>开放平台</span></a></li>
					<li><a href=""><span>微信支付</span></a></li>
					<li><a href=""><span>企业微信</span></a></li>
					<li><a href=""><span>表情开放</span></a></li>
					<li><a href=""><span>微信网页版</span></a></li>
				</ul>
			</div>
		</div>
	</body>
</html>
